*{
	margin: 0px;
	padding: 0px;
}
html{
	background-color: black;
}
.title{
	color: aliceblue;
	position: absolute;
	font-size: 50px;
	font-weight: 200;
	left: 50%;
	top: 50%;
	margin-left: -100px;
	margin-top: -33px;
}
@function createStar($count){
	$str:"#{random($limit: 100)}vw #{random($limit: 100)}vh #fff";
	@for $var from 1 through $count {
		$left:#{random($limit: 10000) / 100}vw;
		$top: #{random($limit: 10000) / 100}vh;
		$str: $str + "," +"#{$left $top #fff}"
	}
	@return unquote($string: $str);
}
@for $var from 1 through 5{
	.box>div:nth-of-type(#{$var}){
		width: #{$var}px;
		height: #{$var}px;
		border-radius: 50%;
		background-color: white;
		box-shadow: createStar(500 * $var);
		animation:move (300 / $var)+s linear infinite;
		&::after{
			content: '';
			width: inherit;
			height:inherit;
			border-radius:inherit;
			background-color:inherit;
			box-shadow:inherit;
			position: fixed;
			top:100vh;
		}
	}
	
}
@keyframes move {
	100%{
		transform: translateY(-100vh);
	}
}